import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    workerList: [],
    // 跳转路由时的id
    clickId: null
    
  },
  // 我发现如果每次都要在状态栏进入详情页面页面会崩掉，因为是每次从地址栏进入就是一次刷新，索引vuex中的数据就会消失掉，造成getter无法早到shuju
  // 造成页面崩掉，因此只要每次把vuex中的数据存到Localstore中，用的时候在取出来就可以解决问题了
  mutations: {
    setWorkerList(state, data){
      state.workerList = data
      localStorage.setItem('workerList', JSON.stringify(data))
    },
  
    updateId(state, id){
      state.clickId = id
    }
  },
  actions: {
    getWorkerList(store){
      axios.get('/worker/user/all')
      .then(
        function(res){
          let result = res.data.data
          store.commit('setWorkerList', result)
        }
      )
      .catch(res=>console.log(res))
      
    }
  },
  getters:{
    // 根据用户id寻找该用户的详细信息
    getWorkerDetail(state){
      let result = state.workerList.find((ele)=>ele.user_id===state.clickId)
      if (!result){
        result = JSON.parse(localStorage.getItem('workerList'))
        return result
      }
      return [result]
    }
  },

  modules: {
  }
})
